<template >
    <div>
        <h4>子路由List</h4>
    </div>
</template>


<script setup>
/**
 *   watch
 *      watche(监听的数据，（）=>{})
 *      监听的数据可以是一个函数，也可以是一个数组
 *           watchEffect(（）=>{})
 *      
 *      ref获取DOM元素,或者组件实例：
 *          <标签 ref=“refName”/>    这是固定语法，不能给ref前面加:
 *          setup：
 *              const refName = ref(null)
 *  
 *   组件化传值：
 *          父传子：
 *              自定义属性传递给子组件：
 *               defuineProps(['属性名'])
 *          子传父：
 *              @自定义事件名=“方法”
 *              const emit = defineEmits(['自定义事件名'])
 *              emit('自定义事件名',数据)
 *              props: ['属性名']  //接收父组件传递过来的值
 *          v-model:
 *              父组件：v-model=“值”
 *             子组件：defineProps(['modelValue'])
 *                   defineEmits(['update:modelValue'])
 *                  emit('update:modelValue',数据)
 *           provide/inject实现多层传值
 *                 父组件：
 *                      import {provide} from 'vue'
 *                      const key=Symbol() //定义一个唯一标识符
 *                      provide('key',数据)
 * 
 *                子组件：
 *                      import {inject} from 'vue'
 *                      const key=Symbol() //定义一个唯一标识符
 *                      const data=inject('key')
 *           mixin混入
 *             1：定义一个js文件，里面定义需要混入的代码
 *             2：在main.js中引入这个js文件
 *             3：在vue实例中进行混入
 * 
 *      插槽:slot:
 *          1：默认插槽
 *          2：具名插槽
 *          3：作用域插槽
 *               <slot :属性名=“组件内部数据”></slot>
 *               <template #name="({属性集合})">
 *                  插槽内容
 *               </template>
 * 
 *     自定义指令
 *         1：全局自定义指令
 *             app.directive('指令名',{
 *                   生命周期（el,binding,）
 *              })
 *         2：局部自定义指令
 *             setup:
 *                 cosnt V指令名={生命周期（el,binding,）}
 * 
 *     teleport传送门
 *         把一个组件渲染到一个指定的结构上
 *         <teleport to="选择器">组件（一般用做弹窗）</teleport>
 * 
 */


</script>


<style scoped>
    
</style>